Miksi tietyt satunnaiset merkkijonot tuottavat värejä, kun ne syötetään taustaväreinä HTML: ään? Esimerkiksi: testi ... tuottaa asiakirjan punaisella taustalla kaikilla selaimilla ja alustoilla. Mielenkiintoista on, että vaikka chucknorri tuottaa myös punaisen taustan, chucknorr tuottaa keltaisen taustan. Mitä täällä tapahtuu?
2020-12-07 21:56:35
Se on Netscape-päivien pidätin: Puuttuvia numeroita käsitellään arvona 0 [...]. Väärä numero tulkitaan yksinkertaisesti 0. Esimerkiksi arvot # F0F0F0, F0F0F0, F0F0F, #FxFxFx ja FxFxFx ovat kaikki samat. Se on blogikirjoituksesta Pieni huhu Microsoft Internet Explorerin värien jäsentämisestä, joka kattaa sen erittäin yksityiskohtaisesti, mukaan lukien vaihtelevat väriarvot jne. Jos sovellamme sääntöjä vuorotellen blogikirjoituksesta, saamme seuraavan: Korvaa kaikki kelpaamattomat heksadesimaalimerkit 0: lla: chucknorrikseksi tulee c00c0000000 Täytä seuraava 3: lla (11 → 12) jaettavien merkkien kokonaismäärä: c00c 0000 0000 Jaettu kolmeen yhtä suureen ryhmään siten, että kukin komponentti edustaa RGB-värin vastaavaa värikomponenttia: RGB (c00c, 0000, 0000) Lyhennä jokainen argumentti oikealta alaspäin kahteen merkkiin. Mikä lopulta antaa seuraavan tuloksen: RGB (c0, 00, 00) = # C00000 tai RGB (192, 0, 0) Tässä on esimerkki bgcolor-määritteen toiminnasta tämän "hämmästyttävän" värimallin tuottamiseksi:chuck norris Herra T ninjaturtle Tämä vastaa myös kysymyksen toiseen osaan: Miksi bgcolor = "chucknorr" tuottaa keltaisen värin? No, jos sovellamme sääntöjä, merkkijono on: c00c00000 => c00 c00 000 => c0 c0 00 [RGB (192, 192, 0)] Mikä antaa vaalean keltaisen kullan värin. Kun merkkijono alkaa 9 merkillä, pidämme toisen C: n tällä kertaa, joten se päätyy lopulliseen väriarvoon. Alun perin tapasin tämän, kun joku huomautti, että voit tehdä color = "paska", ja no, se tulee ruskea. | Olen pahoillani siitä, että olen eri mieltä, mutta @Yuhong Baon lähettämien vanhojen väriarvojen jäsentämistä koskevien sääntöjen mukaan chucknorris EI ole sama kuin # CC0000, vaan # C00000, hyvin samanlainen, mutta hieman erilainen punaisen sävy. Käytin Firefox ColorZilla -lisäosaa tämän tarkistamiseen. Säännöissä todetaan: tee merkkijonosta pituus, joka on 3-kertainen, lisäämällä 0: t: chucknorris0 erota merkkijono 3 yhtä pituiseksi merkkijonoksi: chuc knor ris0 katkaise jokainen merkkijono kahdeksi merkiksi: ch kn ri pidä heksadesimaaliarvot ja lisää tarvittaessa 0: t: C0 00 00 Pystyin näiden sääntöjen avulla tulkitsemaan oikein seuraavat merkkijonot: Onnenkalut Onnea LuckBeALady LuckBeALadyTonight GangnamTyyli PÄIVITYS: Alkuperäiset vastaajat, jotka sanoivat väriksi # CC0000, ovat sittemmin muokanneet vastauksiaan sisällyttämään korjauksen. | Suurin osa selaimista yksinkertaisesti jättää huomiotta kaikki merkkijonossa olevat NON-hex-arvot korvaamalla muut kuin heksanumerot nollilla. ChuCknorris tarkoittaa käännöstä c00c0000000. Tässä vaiheessa selain jakaa merkkijonon kolmeen yhtä suureen osaan, jotka osoittavat punaisen, vihreän ja sinisen arvon: c00c 0000 0000. Jokaisessa osassa olevat ylimääräiset bitit jätetään huomioimatta, mikä tekee lopputuloksesta # c00000 punertavan värisen. Huomaa, että tämä ei koske CSS-värin jäsentämistä, joka noudattaa CSS-standardia. sairas paska ruoho Punertava
Sama kuin yllä
Musta
| Syy on, että selain ei ymmärrä sitä ja yritä jotenkin kääntää se ymmärrettäväksi ja tässä tapauksessa heksadesimaaliarvoksi! ... chucknorris alkaa c: llä, joka tunnistetaan heksadesimaalimerkillä, ja se muuntaa kaikki tunnistamattomat merkit 0: ksi! Joten chucknorrisista heksadesimaalimuodossa tulee: c00c00000000, kaikista muista merkeistä tulee 0 ja c pysyy siellä missä ne ovat ... Nyt ne jaetaan 3: lla RGB: lle (punainen, vihreä, sininen) ... R: c00c, G: 0000, B: 0000 ... Mutta tiedämme, että RGB: n kelvollinen heksadesimaali on vain 2 merkkiä, tarkoittaa R: c0, G: 00, B: 00 Joten todellinen tulos on: bgcolor = "# c00000"; Lisäsin myös kuvan vaiheet pikaviitteeksi sinulle: | Selain yrittää muuntaa chucknorriksen hex-värikoodiksi, koska se ei ole kelvollinen arvo. Chucknorrisissa kaikki paitsi c eivät ole kelvollinen heksadesimaaliarvo. Joten se muunnetaan arvoksi c00c00000000. Josta tulee # c00000, punainen sävy. Tämä näyttää olevan ongelma ensisijaisesti Internet Explorerissa ja Operassa (12), koska sekä Chrome (31) että Firefox (26) vain sivuuttavat tämän. P.S. Suluissa olevat numerot ovat selainversioita, joissa testasin. Kevyemmällä nuotilla Chuck Norris ei ole verkkostandardien mukainen. Verkostandardit ovat yhdenmukaisia hänelle. # BADA55 | WHATWG HTML -määrityksessä on tarkka algoritmi vanhan värin jäsentämiseenarvo: https://html.spec.whatwg.org/multipage/infrastructure.html#rules-for-parsing-a-legacy-colour-value. Värijonojen jäsentämiseen käytetty koodi Netscape Classic on avoimen lähdekoodin: https://dxr.mozilla.org/classic/source/lib/layout/layimage.c#155. Esimerkiksi, huomaa, että jokainen merkki jäsennetään kuusinumeroisena ja siirretään sitten 32-bittiseksi kokonaisluvuksi tarkistamatta ylivuotoa. Vain kahdeksan heksadesimaalista tilaa mahtuu 32-bittiseen kokonaislukuun, minkä vuoksi vain viimeiset 8 merkkiä otetaan huomioon. Parsattuasi heksanumerot 32-bittisiksi kokonaisluvuiksi ne katkaistaan sitten 8-bittisiksi kokonaislukuiksi jakamalla ne 16: lla, kunnes ne sopivat 8-bittisiin, minkä vuoksi etunollat jätetään huomiotta. Päivitys: Tämä koodi ei täsmää tarkalleen määritelmässä määritetyn kanssa, mutta ainoa ero siinä on muutama koodirivi. Luulen, että nämä rivit lisättiin (Netscape 4: ssä): if (tavua_per_val> 4) { tavu_per_val = 4; } | Vastaus: Selain yrittää muuntaa chucknorriksen heksadesimaaliarvoksi. Koska c on chucknorrisin ainoa kelvollinen heksamerkki, arvo muuttuu arvoksi: c00c00000000 (0 kaikille virheellisille arvoille). Selain jakaa sitten tuloksen 3 ryhmään: Punainen = c00c, Vihreä = 0000, Sininen = 0000. Koska kelvolliset html-taustojen heksadesimaaliarvot sisältävät vain 2 numeroa kullekin värityypille (r, g, b), viimeiset 2 numeroa katkaistaan jokaisesta ryhmästä, jolloin rgb-arvo on c00000, joka on tiili-punertava sävy. | chucknorris alkaa kirjaimella c, ja selain lukee sen heksadesimaaliarvoksi. Koska A, B, C, D, E ja F ovat heksadesimaalimerkkejä. Selain muuntaa chucknorriset heksadesimaaliarvoksi C00C00000000. Sitten C00C00000000 heksadesimaaliarvo muunnetaan RGB-muotoon (jaettuna 3: lla): C00C00000000 ⇒ R: C00C, G: 0000, B: 0000 Selain tarvitsee vain kaksi numeroa värin osoittamiseksi: R: C00C, G: 0000, B: 0000 ⇒ R: C0, G: 00, B: 00 ⇒ C00000 Näytä lopuksi bgcolor = C00000 verkkoselaimessa. Tässä on esimerkki sen osoittamisesta:| Perinteisten määritteiden värien jäsentämistä koskeviin sääntöihin sisältyy lisävaiheita kuin mitä nykyisissä vastauksissa mainitaan. Kaksinumeroisen osan katkaisukomponentti kuvataan seuraavasti: Hävitä kaikki merkit paitsi viimeiset 8 Hävitä etunollat yksitellen, kunhan kaikilla komponenteilla on etunolla Hävitä kaikki merkit paitsi ensimmäiset 2 Joitain esimerkkejä: oooFoooFoooF 000F 000F 000F <- vaihda, tyyny ja osa 0F 0F 0F <- etunollat katkaistuna 0F 0F 0F <- katkaistu 2 merkkiin oikealta oooFooFFoFFF 000F 00FF 0FFF <- vaihda, tyyny ja osa 00F 0FF FFF <- etunollat katkaistuna 00 0F FF <- katkaistu 2 merkkiin oikealta ABCooooooABCooooooABCoooooo ABC000000 ABC000000 ABC000000 <- vaihda, tyyny ja osa BC000000 BC000000 BC000000 <- katkaistu 8 merkkiin vasemmalta BC BC BC <- katkaistu 2 merkkiin oikealta AoCooooooAoCooooooAoCoooooo A0C000000 A0C000000 A0C000000 <- vaihda, tyyny ja osa 0C000000 0C000000 0C000000 <- katkaistu 8 merkkiin vasemmalta C000000 C000000 C000000 <- etunollat katkaistuna C0 C0 C0 <- katkaistu 2 merkiksi oikealta Alla on osittainen algoritmin toteutus. Se ei käsittele virheitä tai tapauksia, joissa käyttäjä antaa kelvollisen värin. funktio parseColor (input) { // todo: return error if input is "" input = input.trim (); // todo: palautusvirhe, jos syöttö on "läpinäkyvä" // todo: palauta vastaava #rrggbb, jos syötteen nimi on nimetty väri // todo: return #rrggbb jos syöttö vastaa #rgb // todo: korvaa unicode-koodipisteet, jotka ovat suurempia kuin U + FFFF, 00: lla if (syöttö.pituus> 128) { input = input.lice (0, 128); } if (input.charAt (0) === "#") { input = input.lice (1); } input = input.replace (/ [^ 0-9A-Fa-f] / g, "0"); while (input.length === 0 || input.length% 3> 0) { tulo + = "0"; } var r = input.lice (0, input.pituus / 3); var g = input.lice (input.length / 3, input.length * 2/3); var b = input.lice (input.length * 2/3); jos (r.pituus> 8) { r = r.leike (-8); g = g viipale (-8); b = b. viipale (-8); } while (r.pituus> 2 && r.charAt (0) === "0" && g.charAt (0) === "0" && b.charAt (0) === "0") { r = r. viipale (1); g = g viipale (1); b = b. viipale (1); } jos (r.pituus> 2) { r = r. viipale (0, 2); g = g. viipale (0, 2); b = b. viipale (0, 2); } palauta "#" + r.padStart (2, "0") + g.padStart (2, "0") + b.padStart (2, "0"); } $ (function () { $ ("# input"). on ("muuta", function () { var input = $ (tämä) .val (); var color = parseColor (syöttö); var $ solut = $ ("# tulos tbody td"); $ solut.eq (0) .attr ("bgcolor", syöte); $ solut eq (1). attr ("bgcolor", väri); vararvo: https://html.spec.whatwg.org/multipage/infrastructure.html#rules-for-parsing-a-legacy-colour-value. Värijonojen jäsentämiseen käytetty koodi Netscape Classic on avoimen lähdekoodin: https://dxr.mozilla.org/classic/source/lib/layout/layimage.c#155. Esimerkiksi, huomaa, että jokainen merkki jäsennetään kuusinumeroisena ja siirretään sitten 32-bittiseksi kokonaisluvuksi tarkistamatta ylivuotoa. Vain kahdeksan heksadesimaalista tilaa mahtuu 32-bittiseen kokonaislukuun, minkä vuoksi vain viimeiset 8 merkkiä otetaan huomioon. Parsattuasi heksanumerot 32-bittisiksi kokonaisluvuiksi ne katkaistaan sitten 8-bittisiksi kokonaislukuiksi jakamalla ne 16: lla, kunnes ne sopivat 8-bittisiin, minkä vuoksi etunollat jätetään huomiotta. Päivitys: Tämä koodi ei täsmää tarkalleen määritelmässä määritetyn kanssa, mutta ainoa ero siinä on muutama koodirivi. Luulen, että nämä rivit lisättiin (Netscape 4: ssä): if (tavua_per_val> 4) { tavu_per_val = 4; } | Vastaus: Selain yrittää muuntaa chucknorriksen heksadesimaaliarvoksi. Koska c on chucknorrisin ainoa kelvollinen heksamerkki, arvo muuttuu arvoksi: c00c00000000 (0 kaikille virheellisille arvoille). Selain jakaa sitten tuloksen 3 ryhmään: Punainen = c00c, Vihreä = 0000, Sininen = 0000. Koska kelvolliset html-taustojen heksadesimaaliarvot sisältävät vain 2 numeroa kullekin värityypille (r, g, b), viimeiset 2 numeroa katkaistaan jokaisesta ryhmästä, jolloin rgb-arvo on c00000, joka on tiili-punertava sävy. | chucknorris alkaa kirjaimella c, ja selain lukee sen heksadesimaaliarvoksi. Koska A, B, C, D, E ja F ovat heksadesimaalimerkkejä. Selain muuntaa chucknorriset heksadesimaaliarvoksi C00C00000000. Sitten C00C00000000 heksadesimaaliarvo muunnetaan RGB-muotoon (jaettuna 3: lla): C00C00000000 ⇒ R: C00C, G: 0000, B: 0000 Selain tarvitsee vain kaksi numeroa värin osoittamiseksi: R: C00C, G: 0000, B: 0000 ⇒ R: C0, G: 00, B: 00 ⇒ C00000 Näytä lopuksi bgcolor = C00000 verkkoselaimessa. Tässä on esimerkki sen osoittamisesta: chucknorris c00c00000000 c00000 | Perinteisten määritteiden värien jäsentämistä koskeviin sääntöihin sisältyy lisävaiheita kuin mitä nykyisissä vastauksissa mainitaan. Kaksinumeroisen osan katkaisukomponentti kuvataan seuraavasti: Hävitä kaikki merkit paitsi viimeiset 8 Hävitä etunollat yksitellen, kunhan kaikilla komponenteilla on etunolla Hävitä kaikki merkit paitsi ensimmäiset 2 Joitain esimerkkejä: oooFoooFoooF 000F 000F 000F <- vaihda, tyyny ja osa 0F 0F 0F <- etunollat katkaistuna 0F 0F 0F <- katkaistu 2 merkkiin oikealta oooFooFFoFFF 000F 00FF 0FFF <- vaihda, tyyny ja osa 00F 0FF FFF <- etunollat katkaistuna 00 0F FF <- katkaistu 2 merkkiin oikealta ABCooooooABCooooooABCoooooo ABC000000 ABC000000 ABC000000 <- vaihda, tyyny ja osa BC000000 BC000000 BC000000 <- katkaistu 8 merkkiin vasemmalta BC BC BC <- katkaistu 2 merkkiin oikealta AoCooooooAoCooooooAoCoooooo A0C000000 A0C000000 A0C000000 <- vaihda, tyyny ja osa 0C000000 0C000000 0C000000 <- katkaistu 8 merkkiin vasemmalta C000000 C000000 C000000 <- etunollat katkaistuna C0 C0 C0 <- katkaistu 2 merkiksi oikealta Alla on osittainen algoritmin toteutus. Se ei käsittele virheitä tai tapauksia, joissa käyttäjä antaa kelvollisen värin. funktio parseColor (input) { // todo: return error if input is "" input = input.trim (); // todo: palautusvirhe, jos syöttö on "läpinäkyvä" // todo: palauta vastaava #rrggbb, jos syötteen nimi on nimetty väri // todo: return #rrggbb jos syöttö vastaa #rgb // todo: korvaa unicode-koodipisteet, jotka ovat suurempia kuin U + FFFF, 00: lla if (syöttö.pituus> 128) { input = input.lice (0, 128); } if (input.charAt (0) === "#") { input = input.lice (1); } input = input.replace (/ [^ 0-9A-Fa-f] / g, "0"); while (input.length === 0 || input.length% 3> 0) { tulo + = "0"; } var r = input.lice (0, input.pituus / 3); var g = input.lice (input.length / 3, input.length * 2/3); var b = input.lice (input.length * 2/3); jos (r.pituus> 8) { r = r.leike (-8); g = g viipale (-8); b = b. viipale (-8); } while (r.pituus> 2 && r.charAt (0) === "0" && g.charAt (0) === "0" && b.charAt (0) === "0") { r = r. viipale (1); g = g viipale (1); b = b. viipale (1); } jos (r.pituus> 2) { r = r. viipale (0, 2); g = g. viipale (0, 2); b = b. viipale (0, 2); } palauta "#" + r.padStart (2, "0") + g.padStart (2, "0") + b.padStart (2, "0"); } $ (function () { $ ("# input"). on ("muuta", function () { var input = $ (tämä) .val (); var color = parseColor (syöttö); var $ solut = $ ("# tulos tbody td"); $ solut.eq (0) .attr ("bgcolor", syöte); $ solut eq (1). attr ("bgcolor", väri); var chucknorris c00c00000000 c00000